| el | 您所在的位置：网站首页 › el-form rules › el |
el
|
问题
elementUI框架中的el-form标签中的rules遇到数组改怎么配置？ 描述基本数据如下所示，form数据中包含一个数据，那么数组中的rules该怎么设置呢？ // form表单的数据 form: { key1: '', key2: '', key3: [ { key3_key1: '', key3_key2: '' }, { key3_key1: '', key3_key2: '' } ] } // el-form标签 复制代码增加普通的rules增加普通的rules，然后就可以规定key1值必填（会出现一个小红星），key2值必填并且是数字。 // rules规则 rules: { key1: [ {required: true, message: '请填写key1值', trigger: 'change'} ], key2: [ { type: 'number', required: true, message: '请正确的填写key2值', trigger: 'change' } ] } // el-form表单上增加rules ... 复制代码增加完成key1，key2值的填写规则，但是key3数组中的key3_key1值和key3_key2也是必填，并且有自己的填写规则，那么这个怎么实现呢？ 为key3数组中的key3_key1值和key3_key2增加rules 第一步：设置中key3_key1和key3_key2的prop值 复制代码注意观察prop值，'key3.'(form数组的字段名称) + i (v-for数组中的循环的index) + '.key3_key1'(数组中每个对象的字段名称) 重点注意：注意key3后面有一个点，key3_key1前面也有一个点，千万要住点不要丢了。 第二步：编写rules // rules值 productGroupRules: { key3_key1: [ {required: true, message: '请填写key3_key1值', trigger: 'change'} ], key3_key2: [ { type: 'number', required: true, message: '请正确的填写key3_key2值', trigger: 'change' } ] } // 将rules作为属性加到对应的el-form-item标签上 复制代码结果下图中，所有的key值前面都出现了小红星，说明是生效了，rules是都生效了，完美结束。 提供源代码哦 链接：pan.baidu.com/s/1wj90rA_S… 提取码：tpau 有问题的，欢迎在下方留言哦 |
【本文地址】
公司简介
联系我们
| 今日新闻 |
| 推荐新闻 |
| 专题文章 |